import React, { Component } from 'react';
import { Form, Input, Button, Checkbox } from 'antd';
import axios from "../../util/axios"
class Login extends Component {
    componentDidMount() {
        sessionStorage.clear()
        localStorage.clear()
    }
    onFinish = (values) => {
        axios.get(`/login?username=${values.username}&password=${values.password}`).then(res => {
            if (res.data.code === 200) {
                window.localStorage.setItem('token', res.data.token)
                window.sessionStorage.setItem('authName', res.data.data.nickname)
                window.sessionStorage.setItem('auth', res.data.data.username)
                this.props.history.push('/home')
            } else {
                alert('登陆失败')
            }
        })
    };
    render() {
        return (
            <div className='login'>
                <div className="loginInner">
                    <h3 className='loginTitle'>欢迎登陆电商后台管理系统</h3>
                    <div className="form">
                        <Form
                            name="basic"
                            labelCol={{
                                span: 8,
                            }}
                            wrapperCol={{
                                span: 16,
                            }}
                            initialValues={{
                                remember: true,
                            }}
                            onFinish={this.onFinish}
                            autoComplete="off"
                        >
                            <Form.Item
                                label="Username"
                                name="username"
                                rules={[
                                    {
                                        required: true,
                                        message: 'Please input your username!',
                                    },
                                ]}
                            >
                                <Input />
                            </Form.Item>

                            <Form.Item
                                label="Password"
                                name="password"
                                rules={[
                                    {
                                        required: true,
                                        message: 'Please input your password!',
                                    },
                                ]}
                            >
                                <Input.Password />
                            </Form.Item>

                            <Form.Item
                                name="remember"
                                valuePropName="checked"
                                wrapperCol={{
                                    offset: 8,
                                    span: 16,
                                }}
                            >
                                <Checkbox>Remember me</Checkbox>
                            </Form.Item>

                            <Form.Item
                                wrapperCol={{
                                    offset: 8,
                                    span: 16,
                                }}
                            >
                                <Button type="primary" htmlType="submit">
                                    Submit
                                </Button>
                            </Form.Item>
                        </Form>
                    </div>
                </div>
            </div>
        );
    }
}

export default Login;
